<template>
	<view>
		<view class="flex-col page space-y-36">
		  <view class="flex-row items-center group space-x-16">
		    <image
			@click="ToBack()"
		      class="image"
		      src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158360274597851.png"
		    />
		    <text class="text">我的信息</text>
		  </view>
		  <view class="flex-col section">
		    <view class="flex-col justify-start section_2">
		      <view class="flex-row justify-between section_3">
		        <view class="flex-row self-center space-x-12">
		          <image
		            class="image_2"
		            src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158362843074572.png"
		          />
		          <view class="flex-col self-start group_2 space-y-10">
		            <text class="self-start text_2">{{name}}</text>
		            <view class="flex-row space-x-8">
		              <text class="font_1">{{age}}</text>
		              <!-- text class="font_1">2323粉丝</text> -->
		            </view>
		          </view>
		        </view>
		        <image
				@click="ToChangeInf()"
		          class="self-start image_3"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/f85bc67f181ef27415159d2ef37d6864.png"
		        />
		      </view>
		    </view>
		    <view class="flex-col group_3 view space-y-10">
		      <view class="flex-row justify-between group_4">
		        <text class="self-start font_2 text_4">电话</text>
		        <text class="self-center font_2 text_3">邮箱</text>
		      </view>
		      <view class="flex-row group_5 space-x-56">
		        <text class="font_3">{{phone}}</text>
		        <text class="font_3 email">{{email}}</text>
		      </view>
		      <view class="flex-col">
		        <image
		          class="self-start image_4"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018111489421.png"
		        />
		        <image
		          class="self-end image_4"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018111489421.png"
		        />
		      </view>
		    </view>
		    <view class="flex-col group_3 view_2">
		      <view class="flex-col group_6">
		        <view class="flex-row justify-between items-center">
		          <text class="font_4 text_6">地区</text>
		          <text class="font_2 text_5">性别</text>
		        </view>
		        <view class="flex-row items-center group_8 space-x-94">
		          <view class="flex-row items-center self-stretch space-x-4">
		            <text class="font_4 text_7">{{province}}</text>
		           <text class="font_5">{{city}}</text>
		          </view>
		          <text class="font_3">{{gender}}</text>
		        </view>
		        <view class="flex-row justify-between relative group_7">
		          <image
		            class="image_5 image_6"
		            src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		          />
		          <image
		            class="image_5"
		            src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		          />
		        </view>
		      </view>
		      <view class="flex-col">
		        <image
		          class="self-start image_7"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018151715899.png"
		        />
		        <image
		          class="self-end image_7 image_8"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018151715899.png"
		        />
		      </view>
		    </view>
		    <view class="flex-row equal-division space-x-20">
		      <view class="flex-col equal-division-item">
		        <text class="self-start font_2">注册日期</text>
		        <text class="self-start font_5 text_8">{{createTime}}</text>
		        <image
		          class="shrink-0 self-end image_5 image_9"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		        />
		        <image
		          class="shrink-0 image_7 image_10"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018151715899.png"
		        />
		      </view>
		      <view class="flex-col equal-division-item">
		        <text class="self-start font_2">出生日期</text>
		        <text class="self-start font_5 text_8">{{birthYear}}-{{birthDay}}</text>
		        <image
		          class="shrink-0 self-end image_5 image_9"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		        />
		        <image
		          class="shrink-0 image_7 image_10"
		          src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018151715899.png"
		        />
		      </view>
		    </view>
		    <view class="flex-row justify-between group_9">
		      <view class="flex-col items-start space-y-12">
		        <text class="font_2">现有积分</text>
		        <text class="font_5 text_9">{{point}}</text>
		      </view>
		      <image
		        class="self-start image_5 image_11"
		        src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		      />
		    </view>
		    <view class="flex-row justify-between items-center group_10">
		      <view class="flex-col items-start space-y-10">
		        <text class="font_2">shopid</text>
		        <text class="font_5">{{shopId}}</text>
		      </view>
		      <image
		        class="image_5 image_12"
		        src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		      />
		    </view>
		    <view class="flex-row justify-between items-center group_10">
		      <view class="flex-col items-start space-y-10">
		        <text class="font_2">身份卡号</text>
		        <text class="font_5">{{identityCard}}</text>
		      </view>
		      <image
		        class="image_5 image_12"
		        src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16874174018195846406.png"
		      />
		    </view>
		  </view>
		</view>
	</view>
</template>

<script>
	import {
		memberGet
	} from '../../api/index.js'//引入会员详情查询接口
	const miniProgramAppid = 'wx5183451345781ce6';
	const secret = 'e4956b4bdf297baf5538593d70c1e093';
	export default {
		data() {
			return {
				isRegister: false,
				identityCard:'',
				shopId:'',
				point:'',
				birthYear:"",
				birthDay:'',
				createTime:'',
				city:'',
				gender:'',
				province:'',
				name:'',
				age:'',
				email:'',
				phone:'',
						
				
			}
		},
		methods: {
			get() {
				uni.showLoading({
					title: '加载中...'
				});
				memberGet({
					  "memberId": uni.getStorageSync("memberId")
				}).then(res => {
						uni.hideLoading();
						this.isRegister = true;
						this.name = res.data.data.name;
						this.point = res.data.data.point;
						this.city=res.data.data.address.city;
						this.birthDay=res.data.data.birthDay;
						this.birthYear=res.data.data.birthYear;
						this.province=res.data.data.address.province;
						this.gender=res.data.data.gender;
						this.email=res.data.data.email;
						this.phone=res.data.data.phone;
						this.identityCard=res.data.data.identityCard;
						this.age=res.data.data.age;
						this.shopId=res.data.data.shopId;
						this.createTime=res.data.data.createTime;
						
						// this.username=res.data.data.name;
				})
				.catch(res => {
						uni.showToast({
							title: '请先注册',
							icon: 'none',
							duration: 2000
						})
				})
			},
			onShow() {
				this.get()
			},
			ToBack(){
				uni.navigateBack({
				    delta: 1
				})
			},
			ToChangeInf(){
				uni.navigateTo({
					url: '/pages/editUser/changeInf'
				})
				
			}
			
			
		}
	}
</script>

<style lang="scss">
.page {
  padding-top: 112rpx;
  background-color: #ffffff;
  background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158321082362771.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  .group {
    padding: 0 32rpx;
    .image {
      width: 24rpx;
      height: 42rpx;
    }
    .text {
      color: #ffffff;
      font-size: 36rpx;
      font-family: HarmonyOSSansSC;
      line-height: 33rpx;
    }
  }
  .space-x-16 {
    & > view:not(:first-child),
    & > text:not(:first-child),
    & > image:not(:first-child) {
      margin-left: 32rpx;
    }
  }
  .section {
    padding: 36rpx 0 64rpx;
    background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158321470243512.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    .section_2 {
      margin: 0 32rpx;
      background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158361882737138.png');
      background-size: 100% 100%;
      background-repeat: no-repeat;
      .section_3 {
        padding: 24rpx;
        background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/648fef445a7e3f0310275929/648ff5ec726ab50011f26fbc/16873158362510307876.png');
        background-size: 100% 100%;
        background-repeat: no-repeat;
        .space-x-12 {
          & > view:not(:first-child),
          & > text:not(:first-child),
          & > image:not(:first-child) {
            margin-left: 24rpx;
          }
          .image_2 {
            width: 150rpx;
            height: 150rpx;
          }
          .group_2 {
            margin-top: 16rpx;
            .text_2 {
              color: #000000;
              font-size: 34rpx;
              font-family: HarmonyOSSansSC;
              line-height: 31rpx;
            }
            .space-x-8 {
              & > view:not(:first-child),
              & > text:not(:first-child),
              & > image:not(:first-child) {
                margin-left: 16rpx;
              }
              .font_1 {
                font-size: 24rpx;
                font-family: HarmonyOSSansSC;
                line-height: 22rpx;
                color: #777777;
              }
            }
          }
        }
        .image_3 {
          margin-right: 12rpx;
          margin-top: 12rpx;
          width: 42rpx;
          height: 36rpx;
        }
      }
    }
    .group_3 {
      padding: 0 36rpx;
      .group_4 {
        padding: 0 40rpx;
        .text_4 {
          margin-top: 12rpx;
        }
        .text_3 {
          margin-right: 184rpx;
        }
      }
      .group_5 {
        padding: 0 4rpx;
      }
      .space-x-56 {
        & > view:not(:first-child),
        & > text:not(:first-child),
        & > image:not(:first-child) {
          margin-left: 112rpx;
        }
      }
      .image_4 {
        width: 318rpx;
        height: 2rpx;
      }
      .group_6 {
        padding-bottom: 16rpx;
        height: 89rpx;
        .font_4 {
          font-size: 24rpx;
          font-family: SourceHanSansCN;
          line-height: 22rpx;
        }
        .text_6 {
          color: #a5a5a5;
        }
        .text_5 {
          margin-right: 230rpx;
        }
        .group_8 {
          margin-top: 20rpx;
          .space-x-4 {
            & > view:not(:first-child),
            & > text:not(:first-child),
            & > image:not(:first-child) {
              margin-left: 8rpx;
            }
            .text_7 {
              color: #323643;
            }
          }
        }
        .space-x-94 {
          & > view:not(:first-child),
          & > text:not(:first-child),
          & > image:not(:first-child) {
            margin-left: 188rpx;
          }
        }
        .group_7 {
          margin-top: -52rpx;
          .image_6 {
            margin-left: 284rpx;
          }
        }
      }
      .font_3 {
		padding-left: 35rpx;
        font-size: 24rpx;
        font-family: HarmonyOSSansSC;
        line-height: 18rpx;
        color: #323643;
      }
      .image_8 {
        margin-right: 8rpx;
      }
    }
    .view {
      margin-top: 108rpx;
    }
    .space-y-10 {
      & > view:not(:first-child),
      & > text:not(:first-child),
      & > image:not(:first-child) {
        margin-top: 20rpx;
      }
    }
    .view_2 {
      margin-top: 88rpx;
    }
    .equal-division {
      margin-top: 84rpx;
      padding: 0 20rpx;
      .equal-division-item {
        flex: 1 1 356rpx;
        padding: 8rpx 16rpx 0;
        .text_8 {
          margin-top: 20rpx;
          line-height: 23rpx;
        }
        .image_9 {
          margin-top: -48rpx;
        }
        .image_10 {
          margin-right: 4rpx;
          margin-top: 36rpx;
        }
      }
    }
    .space-x-20 {
      & > view:not(:first-child),
      & > text:not(:first-child),
      & > image:not(:first-child) {
        margin-left: 40rpx;
      }
    }
    .font_2 {
      font-size: 24rpx;
      font-family: HarmonyOSSansSC;
      line-height: 22rpx;
      color: #a5a5a5;
    }
    .font_5 {
      font-size: 24rpx;
      font-family: HarmonyOSSansSC;
      line-height: 22rpx;
      color: #323643;
    }
    .image_5 {
      width: 26rpx;
      height: 32rpx;
    }
    .image_7 {
      width: 316rpx;
      height: 2rpx;
    }
    .group_9 {
      margin: 92rpx 36rpx 0;
      padding-bottom: 12rpx;
      border-bottom: solid 2rpx #e1e3e8;
      .space-y-12 {
        & > view:not(:first-child),
        & > text:not(:first-child),
        & > image:not(:first-child) {
          margin-top: 24rpx;
        }
        .text_9 {
          line-height: 24rpx;
        }
      }
      .image_11 {
        margin-right: 4rpx;
        margin-top: 12rpx;
      }
    }
    .group_10 {
      margin: 92rpx 36rpx 0;
      padding-bottom: 20rpx;
      border-bottom: solid 2rpx #e1e3e8;
      .image_12 {
        margin-right: 4rpx;
      }
    }
  }
}
.space-y-36 {
  & > view:not(:first-child),
  & > text:not(:first-child),
  & > image:not(:first-child) {
    margin-top: 72rpx;
  }
  .email{
	  margin-left: 50rpx;
  }
}
</style>
